<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/common/load_resources.jsp"%>
<script>
	var availableTags = [
           	      "ActionScript",
           	      "AppleScript",
           	      "Asp",
           	      "BASIC",
           	      "C",
           	      "C++",
           	      "Clojure",
           	      "COBOL",
           	      "ColdFusion",
           	      "Erlang",
           	      "Fortran",
           	      "Groovy",
           	      "Haskell",
           	      "Java",
           	      "JavaScript",
           	      "Lisp",
           	      "Perl",
           	      "PHP",
           	      "Python",
           	      "Ruby",
           	      "Scala",
           	      "Scheme"
           	    ];
	$(document).ready(function() {
		$('body').layout({
			applyDefaultStyles : true,
			defaults : {
				fxName : "slide",
				fxSpeed : "fast",
				spacing_closed : 20,
				initClosed : false
			},
			north : {
				closable : false,
				resizable : false
			},
			west : {
				size : "20%",
				slideTrigger_open : "mouseover",
				resizable : false,
				closed : true 
			},
			east : {
				size : "30%"
			}
		});
		$("#navigation").accordion({
			icons: { "header": "ui-icon-plus", "headerSelected": "ui-icon-minus" }
		});
		$( "#tags" ).autocomplete({
		      source: availableTags
		});
	});
	
</script>
</head>
<body>
	<div class="ui-layout-center" id="center">
	</div>
	<div class="ui-layout-north">
		<div class="center_align">
			<span class="headline">Inventory Management Software </span> 
			<span class="logout"><a href="<c:url value="/j_spring_security_logout" />">Logout</a></span>
		</div>
	</div>
	<!-- 	<div class="ui-layout-south">South</div> -->
	<div class="ui-layout-east">Product Search
		<div class="ui-widget">
		  <label for="tags">Tags: </label>
		  	<input id="tags" />
		</div>
	</div>
	<div class="ui-layout-west" id="navigation">
		<h3>Billing</h3>
			<ul>
				<li><a href="#">Sale Invoice</a></li>
				<li><a href="#">Purchase Invoice</a></li>
			</ul>
		<h3>Medicine Type</h3>
			<ul>
				<li><a href="javascript:loadContent('#divContent', 'viewProductTypes.do');">View All</a></li>
				<li><a href="javascript:loadContent('#divContent', 'addProductTypes.do');">Add New</a></li>
				<li><a href="javascript:loadContent('#divContent', 'editProductTypes.do');">Modify</a></li>
				<li><a href="javascript:loadContent('#divContent', 'deleteProductTypes.do');">Delete</a></li>
			</ul>
	</div>
	<div id="divContent" css="hidden"></div>
</body>
</html>